<template>
	<view :style="'background-image: url(../../static/account-background.png);background-repeat:no-repeat; background-size: 100% auto; -moz-background-size:100% 100%;'">
		<view>
			<!-- 右上角的图标 -->
			<u-row>
				<u-col span="1" offset="9" style="margin-top: 40rpx;">
					<navigator url="message" hover-class="none">
						<u-icon name="bell" color="#ffffff" size="50"></u-icon>
					</navigator>
				</u-col>
				<u-col span="1" style="margin-top: 40rpx;">
					<navigator url="setting" hover-class="none">
						<u-icon style="margin-left: 30rpx;" name="setting" color="#ffffff" size="50"></u-icon>
					</navigator>
				</u-col>
			</u-row>

			<!-- 登陆注册 -->
			<u-row style="margin-top: 25rpx;">
				<u-card :show-head="false" :show-foot="false" style="width: 100%; box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);"
				 @click="loginRegister">
					<view slot="body">
						<u-row @tap="loginRegister">
							<u-col span="3" @tap="loginRegister">
								<u-avatar size="large" :src="avatar"></u-avatar>
							</u-col>

							<u-col span="4" style="font-size: medium; font-weight: 900;" @tap="loginRegister">
								<view v-if="!isLogin">
									登陆/注册
								</view>
								<view v-else>
									{{userName}}
								</view>
							</u-col>

							<u-col span="1" offset="4" @tap="loginRegister">
								<u-icon name="arrow-right" color="#bfc4cb" size="30" v-if='!ischange'></u-icon>
							</u-col>
						</u-row>
					</view>
				</u-card>
			</u-row>

			<!-- 分割线 -->
			<u-row>
				<u-divider :use-slot="false" half-width="340" style="margin-top: 25rpx;" />
			</u-row>

			<!-- 分享  评分 -->
			<u-row>
				<u-card :border="false" :show-head="false" :show-foot="false" style="width: 100%; margin-top: 20rpx; margin-bottom: 0rpx;">
					<view class="" slot="body">

						<u-row style="margin-bottom: 50rpx;">
							<u-col span="1">
								<u-icon name="share" size="60rpx" color="#19be6b"></u-icon>
							</u-col>
							<u-col span="10">
								<view style="font-size: 35rpx; margin-left: 15rpx;">分享APP</view>
							</u-col>
							<u-col span="1">
								<u-icon name="arrow-right" size="30" color="#bfc4cb"></u-icon>
							</u-col>
						</u-row>

						<u-row style="margin-bottom: 30rpx;">
							<u-col span="1">
								<u-icon name="star" size="60rpx" color="#ff9900"></u-icon>
							</u-col>
							<u-col span="10">
								<view style="font-size: 35rpx; margin-left: 15rpx;">去评分</view>
							</u-col>
							<u-col span="1">
								<u-icon name="arrow-right" size="30" color="#bfc4cb"></u-icon>
							</u-col>
						</u-row>

					</view>
				</u-card>
			</u-row>

		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				url: this.GOBAL.baseURL,
				ischange: false,
				userName: '用户名',
				isLogin: false,
				screenWidth: 1280,
				screenHeight: 1920,
				avatar: '',
			}
		},
		methods: {
			loginRegister(e) {
				let that = this;
				if (!that.isLogin) {
					uni.navigateTo({
						url: 'basicLogin/login',
					});
				} else {
					uni.navigateTo({
						url: 'personal',
					});
				}
			},
		},
		onShow() {
			let that = this;

			// console.log("视图更新")

			uni.getStorage({
				key: 'userName',
				success: function(res) {
					// console.log(res.data)
					that.isLogin = true;
					that.userName = res.data;
					that.avatar = that.url + "userImages/" + uni.getStorageSync("userImage")
				},
				fail: function(res) {
					// console.log("未登陆")
					that.isLogin = false;
					that.avatar = '@/static/default.png'
				}
			});
		},
		mounted() {
			let that = this
			uni.getStorage({
				key: 'userImage',
				success: function(res) {
					// that.avatar = that.url + "userImages/" + res.data
					// console.log("有东西吗" + res.data);
				},
			})
		},
		onLoad() {
			// let that = this;

			// uni.getStorage({
			// 	key: 'userName',
			// 	success: function(res) {
			// 		console.log(res.data)
			// 		that.isLogin = true;
			// 		that.userName = res.data
			// 	},
			// 	fail: function(res) {
			// 		console.log("onLoad未登陆")
			// 		that.isLogin = false;
			// 	}
			// });

			// 获取系统信息
			uni.getSystemInfo({
				success(res) {
					this.screenWidth = res.screenWidth;
					this.screenHeight = res.screenHeight
					// console.log(res.brand) //手机牌子
					// console.log(res.model) //手机型号
					// console.log(res.screenWidth) //屏幕宽度
					// console.log(res.screenHeight) //屏幕高度

				}
			});
		},
	}
</script>

<style scoped>

</style>
